<script setup lang="ts">
import UploadAvatar from '@/components/common/UploadAvatar.vue'
import RichTextEditor from '@/components/common/RichTextEditor.vue'
</script>

<template>
  <div>
    <el-form label-width="120px">
      <el-form-item label="机器人头像：">
        <upload-avatar />
      </el-form-item>

      <el-form-item label="机器人名称：">
        <el-row :gutter="20" style="flex: 1">
          <el-col :span="20">
            <el-input placeholder="给智能机器人取个好听的名字吧" />
          </el-col>
          <el-col :span="4">不超过8个字符</el-col>
        </el-row>
      </el-form-item>

      <el-form-item label="欢迎语：">
        <el-row :gutter="20" style="flex: 1">
          <el-col :span="20">
            <rich-text-editor height="100px" />
          </el-col>
          <el-col :span="4"
            >对话开始时，机器人会自动给用户发送一条介绍自己、说明主要功能的欢迎语。（示例：你好，我是机器人小爱，请问有什么可以帮你？）</el-col
          >
        </el-row>
      </el-form-item>

      <el-form-item label="兜底话术：">
        <el-row :gutter="20" style="flex: 1">
          <el-col :span="20">
            <rich-text-editor height="100px" />
          </el-col>
          <el-col :span="4"
            >当用户的提问机器人无法回答时，将使用兜底话术来回复用户。（示例：小爱没有听懂，你可以换个问法试试。）</el-col
          >
        </el-row>
      </el-form-item>
    </el-form>
  </div>
</template>
